<template>
  <layout title="客户信息" :showBack="true" :showTabBar="false">
    <x-icon slot="icon" @click="onSave" type="checkmark" style="fill:#fff;position:relative;top:-4px;right:3px;"></x-icon>

    <group title="联系人信息">
      <x-input title="姓名" v-model="form.name"></x-input>
      <popup-radio title="性别" v-model="form.sex" :options="dicObjArray['性别']"></popup-radio>
      <x-input title="部门" v-model="form.dept"></x-input>
      <x-input title="职位/称呼" v-model="form.position"></x-input>
      <x-input title="手机" v-model="form.tel"></x-input>
      <x-input title="座机" v-model="form.work_tel"></x-input>
      <x-input title="邮箱" v-model="form.email"></x-input>
      <x-input title="QQ/MSN" v-model="form.qq"></x-input>
    </group>
  </layout>
</template>

<script>
  import { Group, Cell, XInput, Selector, PopupRadio, XTextarea } from 'vux'
  import Layout from './Layout.vue'
  import { mapGetters } from 'vuex'
  import { contact as api } from '../api'

  export default {
    components: {
      Group,
      Cell,
      Layout,
      XInput,
      Selector,
      PopupRadio,
      XTextarea,
    },
    data() {
      return {
        form: {
          id: undefined,
          name: null,
          sex: null,
          dept:  null,
          position: null,
          tel: null,
          work_tel: null,
          email: null,
          qq: null,
          customer_id: null,
        },
      }
    },
    methods: {
      showCustomDetail() {
        this.$router.push({ path: 'Custom', query: { customId: 1 } })
      },
      async onSave() {
        let ret = await api.save(this.form)
        if (!ret.success) {
          this.$vux.toast.show('保存失败！')
          return
        }
        let that = this
        this.$vux.toast.show({
          text: '保存成功',
          onHide() {
            that.$router.go(-1)
          }
        })
      }
    },
    computed: {
      ...mapGetters(['dicObjArray'])
    },
    async mounted() {
      this.$store.commit('showBack', true)
      let id = this.$route.query.id
      if (id) {
        let ret = await api.detail({ id })
        if (!ret.success) {
          this.$vue.toast.show('数据读取失败！')
          return
        }
        this.form = ret.data
      }else{
        this.form.customer_id = this.$route.query.customer_id
      }
    }
  }

</script>
